<template>
	<div class="home-form">
		<van-form @submit="onSubmit">
			<van-field
				v-model="selectUser.name"
				name="name"
				placeholder="名称"
				:rules="[{ required: true, message: '请填写名称' }]"
			>
				<template #label> <span style="color: red;">*</span> 名称 </template>
			</van-field>
			<van-field
				v-model="selectUser.num"
				type="digit"
				name="num"
				placeholder="编号"
				:rules="[{ required: true, message: '请填写编号' }]"
			>
				<template #label> <span style="color: red;">*</span> 编号 </template>
			</van-field>
			
			<div style="margin: 16px;">
				<van-button round block type="primary" native-type="submit">
					提交
				</van-button>
			</div>
		</van-form>
	</div>
</template>

<script>
	export default {
		name: "HomeForm",
		props:{
			selectUser:{
				type: Object,
				default:() => { return { name: '', num: '' } }
			}
		},
		setup(props, { emit }){
			const onSubmit = (values) =>{
				emit('onSubmit', values);
			}
			
			return { 
				onSubmit
			}
		}
	}
</script>

<style lang="scss" scoped="scoped">
	.home-form{
		padding: 20px 10px;
	}
</style>
